<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimal-ui" />
    <meta name="format-detection" content="telephone=no, email=no" />
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/fangmama.css">
    <link rel="stylesheet" href="css/swiper.min.css">
    <script src="js/jquery-1.9.1.js"></script>
    <script src="js/swiper3.0.8.min.js"></script>
    <title>2.2</title>
</head>
<body ontouchstart="">
    <div class="head-tit head-color1">约看清单</div>
    <div class="con-layout">
        <!--看房顺序-->
        <div class="trip-layout">
            <a href="javascript:;" class="on">
                <em><i class="iconfont">&#xe602;</i></em>
                <span>预看列表</span>
            </a>
            <a href="javascript:;">
                <em><i class="iconfont">&#xe604;</i></em>
                <span>约看日程</span>
            </a>
            <a href="javascript:;">
                <em><i class="iconfont">&#xe605;</i></em>
                <span>已看房源</span>
            </a>
        </div>
        <div class="house-swiper">

            <div class="swiper-wrapper">
                <div class="swiper-list swiper-slide">
                    <div class="house-list">
                        <div class="house-listall">
                            <div class="house-model house-on">
                                <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                <dl>
                                    <dt><img src="images/temp240.jpg" alt=""></dt>
                                    <dd>
                                        <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                        <p>2室2厅 | 96㎡ | 中层/14层</p>
                                        <p>1天前发布</p>
                                    </dd>
                                </dl>
                            </div>
                            <div class="house-model house-on">
                                <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                <dl>
                                    <dt><img src="images/temp240.jpg" alt=""></dt>
                                    <dd>
                                        <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                        <p>2室2厅 | 96㎡ | 中层/14层</p>
                                        <p>1天前发布</p>
                                    </dd>
                                </dl>
                            </div>
                            <div class="house-model house-on">
                                <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                <dl>
                                    <dt><img src="images/temp240.jpg" alt=""></dt>
                                    <dd>
                                        <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                        <p>2室2厅 | 96㎡ | 中层/14层</p>
                                        <p>1天前发布</p>
                                    </dd>
                                </dl>
                            </div>
                        </div>
                    </div>
                    <div class="mark-sub-time"><input type="button" value="预约时间"></div>
                </div>

                <div class="swiper-list swiper-slide">
                    <div class="house-mark-time">
                        <p class="mark-time-tit"><i class="iconfont">&#xe607;</i> 2015－6-10 14:00至16</p>
                        <div class="house-list">
                            <div class="house-listall">
                                <div class="house-model house-on">
                                    <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                    <dl>
                                        <dt><img src="images/temp240.jpg" alt=""></dt>
                                        <dd>
                                            <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                            <p>2室2厅 | 96㎡ | 中层/14层</p>
                                            <p>1天前发布</p>
                                        </dd>
                                    </dl>
                                    <a href="javascript:;" class="house-seed">已看</a>
                                </div>
                                <div class="house-model house-on">
                                    <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                    <dl>
                                        <dt><img src="images/temp240.jpg" alt=""></dt>
                                        <dd>
                                            <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                            <p>2室2厅 | 96㎡ | 中层/14层</p>
                                            <p>1天前发布</p>
                                        </dd>
                                    </dl>
                                    <a href="javascript:;" class="house-seed">已看</a>
                                </div>
                                <div class="house-model house-on">
                                    <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                    <dl>
                                        <dt><img src="images/temp240.jpg" alt=""></dt>
                                        <dd>
                                            <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                            <p>2室2厅 | 96㎡ | 中层/14层</p>
                                            <p>1天前发布</p>
                                        </dd>
                                    </dl>
                                    <a href="javascript:;" class="house-seed">已看</a>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="house-mark-time">
                        <p class="mark-time-tit"><i class="iconfont">&#xe607;</i> 2015－4-10 12:00至13</p>
                        <div class="house-list">
                            <div class="house-listall">
                                <div class="house-model house-on">
                                    <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                    <dl>
                                        <dt><img src="images/temp240.jpg" alt=""></dt>
                                        <dd>
                                            <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                            <p>2室2厅 | 96㎡ | 中层/14层</p>
                                            <p>1天前发布</p>
                                        </dd>
                                    </dl>
                                    <a href="javascript:;" class="house-seed">已看</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="swiper-list swiper-slide">
                    <div class="house-mark-time">
                        <p class="mark-time-tit"><i class="iconfont">&#xe609;</i> 待定房源</p>
                        <div class="house-list">
                            <div class="house-listall">
                                <div class="house-model house-on">
                                    <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                    <dl>
                                        <dt><img src="images/temp240.jpg" alt=""></dt>
                                        <dd>
                                            <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                            <p>2室2厅 | 96㎡ | 中层/14层</p>
                                            <p>1天前发布</p>
                                        </dd>
                                    </dl>
                                    <div class="house-fav-lv"><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe60a;</i><i class="iconfont">&#xe60a;</i></div>
                                </div>
                                <div class="house-model house-on">
                                    <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                    <dl>
                                        <dt><img src="images/temp240.jpg" alt=""></dt>
                                        <dd>
                                            <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                            <p>2室2厅 | 96㎡ | 中层/14层</p>
                                            <p>1天前发布</p>
                                        </dd>
                                    </dl>
                                    <div class="house-fav-lv"><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe60a;</i><i class="iconfont">&#xe60a;</i></div>
                                </div>
                                <div class="house-model house-on">
                                    <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                    <dl>
                                        <dt><img src="images/temp240.jpg" alt=""></dt>
                                        <dd>
                                            <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                            <p>2室2厅 | 96㎡ | 中层/14层</p>
                                            <p>1天前发布</p>
                                        </dd>
                                    </dl>
                                    <div class="house-fav-lv"><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe608;</i><i class="iconfont">&#xe60a;</i><i class="iconfont">&#xe60a;</i></div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="house-mark-time">
                        <p class="mark-time-tit house-pass"><i class="iconfont">&#xe609;</i> 不考虑房源</p>
                        <div class="house-list">
                            <div class="house-listall">
                                <div class="house-model house-on">
                                    <span class="house-icon-flg"><i class="iconfont">&#xe600;</i></span>
                                    <dl>
                                        <dt><img src="images/temp240.jpg" alt=""></dt>
                                        <dd>
                                            <p><span>厦门软件园二期前埔华林花园一期</span><em><i>4500</i>元/月</em></p>
                                            <p>2室2厅 | 96㎡ | 中层/14层</p>
                                            <p>1天前发布</p>
                                        </dd>
                                    </dl>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
</body>
</html>
<script>
    var mySwiper = new Swiper('.house-swiper',{
        speed:500,
        onSlideChangeStart: function(){
            $(".trip-layout a").removeClass('on')
            $(".trip-layout a").eq(mySwiper.activeIndex).addClass('on')
        }
    })
    $(".trip-layout a").on('touchstart mousedown',function(e){
        e.preventDefault()
        $(".trip-layout .on").removeClass('on')
        $(this).addClass('on')
        mySwiper.slideTo( $(this).index() )
    })
    $(".trip-layout a").click(function(e){
        e.preventDefault()
    })
</script>

